<template>
  <view class="container review">
    <view class="stickyClass">
     <!-- <v-tabhead
			@updateData="@updateData"
        @updateActive="updateActive"
        :headItems="headItems"
        :activeIndex="activeIndex"
      ></v-tabhead> -->
			<v-tabhead
			  @updateActive="updateActive"
			  :headItems="headItems"
			  :activeIndex="activeIndex"
			></v-tabhead>
    </view>
    <swiper :current="activeIndex" class="swiperContainer" @change="changeTab">
      <swiper-item class="swiperContainer" v-for="(item, index) in headItems" :key="index">
        <v-tabbody
          @updateHeadItem="updateHeadItem"
          :homeCode="homeCode"
          :activeIndex="activeIndex"
          :currentCode="headItems[activeIndex].code"
          :code="item.code"
          :index="index"
          :item="item"
          :bodyBtn="bodyBtn"
          @bodysBtn='bodysBtn($event)'
        ></v-tabbody>
      </swiper-item>
    </swiper>

    <button class="mini-btn" @click="examination()" v-if="bodyBtn">自动组卷</button>
  </view>
</template>

<script>
import mixins from "@/mixins/index";
import VTabhead from "./fragment/vtabhead/index";
import VTabbody from "./fragment/vtabbody/index";
import ExamService from "@/services/exam/exam";
import UserService from "@/services/user/index";
import {mapMutations} from 'vuex';
const userService = new UserService();

export default {
  mixins: [mixins],
  components: {
    VTabhead,
    VTabbody
  },
  computed: {
    homeCode() {
      if (this.headItems.length == 0) return "";
      return this.headItems[0].code;
    },
  },
  data() {
    return {
      headItems: [
        {
          title: "公安专业",
          code: "3",
          headClassItem: [],
          activeClassIndex:0
        },
        {
          title: "执法资格",
          code: "2",
          headClassItem: [],
          activeClassIndex:0
        }
      ],
      activeIndex: 0,
      reviewData: [],
      bodyBtn: true
    };
  },
  onLoad() {
  	this.setAscriptionPage({
  		ascriptionPage:this.headItems[this.activeIndex].code
  	});
  },
  methods: {
	...mapMutations({
		setAscriptionPage:'msgStore/setAscriptionPage'
	}),
    updateHeadItem({headClassItem,index}){
        this.headItems[index].headClassItem = headClassItem;
    },
    bodysBtn(e){
      console.log(e)
      this.bodyBtn = e;
    },
    updateActive({activeClassIndex,activeIndex}){
      console.log('updateActive')
      if(activeClassIndex!=undefined){
          this.headItems[this.activeIndex].activeClassIndex = activeClassIndex
      }
      if(activeIndex!=undefined){
          this.activeIndex = activeIndex;
		  this.setAscriptionPage({
			  ascriptionPage:this.headItems[this.activeIndex].code
		  });
      }
    },
    changeTab(e) {
      let index = e.target.current;
      this.activeIndex = index;
    },

    onPress({ id = "", type = 1 }) {
      uni.navigateTo({
        url: `/pages/tabbar/study/details/index?id=${id}&type=${type}`
      });
    },
    examination() {
      if (this.activeIndex == 0) {
        uni.navigateTo({
          url: "/pages/exam/examsub?examType=9&ascription=3"
        });
      }else if(this.activeIndex == 1){
        uni.navigateTo({
          url: "/pages/exam/examsub?examType=9&ascription=2"
        });
      }
    }
  },
};
</script>

<style>
page {
  background-color: #f1f1f1;
}
.swiperContainer {
  width: 100%;
  height: calc(100vh - 80upx);
  /* overflow-y:scroll; */
  flex: 1;
  padding-bottom: 80upx;
}
</style>
<style lang="scss" scoped>
.container {
}
.review {
  display: flex;
  flex-direction: column;
}

.mini-btn {
  border-radius: 30upx;
  width: 200upx;
  height: 60upx;
  line-height: 60upx;
  text-align: center;
  background-color: #377cfd;
  color: #fff;
  font-size: 24upx;
  position: fixed;
  bottom: 10upx;
  margin-top: 30upx;
  left: 50%;
  transform: translate(-50%, 0);
}
</style>
